import React, { Component } from 'react'
import Taro from '@tarojs/taro'
import { View } from '@tarojs/components'
import { AtList, AtListItem, AtButton } from 'taro-ui'

import './myInfo.scss'

export default class MyInfo extends Component {

  constructor(props){
    super(props);
    this.state = {
      isAuthorize:false,
    }
  }

  toMyInfo = () => {
    Taro.redirectTo({url: '/pages/pagesB/myInfo/myInfo'})
  }
  toUserCenter = () => {
    Taro.reLaunch({url: '/pages/userCenter/userCenter'})
  }

  // 清空信息
  emptyInfo = () => {
    // 把用户登录信息清空
    Taro.removeStorageSync('userInfo')
  }

  // 退出登录
  toLogOut = () => {
    this.emptyInfo()
    Taro.showToast({
      title: '退出登录成功',
      icon: 'success',
      duration: 1000
    })
    setTimeout(this.toUserCenter,1000)
  }

  // 检查是否已经取得用户授权
  checkAuthorize = () =>　{
    Taro.getSetting().then(
      res => {
        if(res.authSetting['scope.userInfo']){
          this.setState({isAuthorize:true})
        }
      }
    )
  }

  // 获取微信数据
  weChatData = async () => {
    // 没有获取到的情况下才会再次请求信息
    if(Taro.getStorageSync('userWeChatInfo')==''){
      const userP = {
        lang: 'zh_CN',
        success: (res) => {Taro.setStorageSync('userWeChatInfo',res.userInfo)},
      }
      await Taro.getUserInfo(userP)
      Taro.showToast({
        title: '绑定微信成功',
        icon: 'success',
        duration: 1000
      })
      setTimeout(this.toMyInfo,1000)
    }
  }

  render () {

    this.checkAuthorize()
    const user=Taro.getStorageSync('userInfo')
    const userWeChatInfo = Taro.getStorageSync('userWeChatInfo')    
    
    return (
      <View>
        {/* 获取授权模块 */}
        {
          (process.env.TARO_ENV === 'weapp')?(
            <AtButton plain='true'
             openType='getUserInfo'
             disabled={this.state.isAuthorize}
             onGetUserInfo={this.checkAuthorize,this.weChatData}
            >
              {
                (!this.state.isAuthorize)?('绑定微信'):('已绑定微信')
              }
            </AtButton>
          ):(
            <AtButton open-type="getAuthorize" 
             onGetAuthorize="onGetAuthorize"
             onError="onAuthError" 
             scope='userInfo'
             onClick={
               console.log('4')
             }
            >
              {
                (!this.state.isAuthorize)?('绑定支付宝'):('已绑定支付宝')
              }
            </AtButton>
          )
        }

        {/* 用户基本信息模块 */}
        <AtList className='basicInfo'>
          <AtListItem
            title='手机号'
            extraText={user.userPhone}
            iconInfo={{ size: 25, color: '#78A4FA', value: 'iphone', }}
          />
          <AtListItem
            title='地区'
            extraText={userWeChatInfo.province + '-' + userWeChatInfo.city}
            iconInfo={{ size: 25, color: '#78A4FA', value: 'map-pin', }}
          />
          <AtListItem
            title='昵称'
            extraText={userWeChatInfo.nickName}
            iconInfo={{ size: 25, color: '#78A4FA', value: 'tags', }}
          />
          <AtListItem
            title='修改密码'
            arrow='right'
            iconInfo={{ size: 25, color: '#78A4FA', value: 'lock', }}
            onClick={() =>Taro.navigateTo({url: '/pages/pagesB/resetPwd/resetPwd'})}
          />
          <AtListItem
            title='退出登录'
            arrow='right'
            iconInfo={{ size: 25, color: '#78A4FA', value: 'trash', }}
            onClick={this.toLogOut}
          />
        </AtList>
      </View>
    )
  }
}